<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>秒杀订单列表</title>
    <script type="text/javascript" th:src="@{/jquery.3.6.0.js}"></script>
    <script type="text/javascript" th:inline="javascript">
        /*<![CDATA[*/
        ctxPath = /*[[@{/}]]*/ '';
        /*]]>*/
        console.info(ctxPath);
    </script>　
</head>
<body>
<table border="1">
    <thead>
    <tr>
        <th>订单编号</th>
        <th>订单状态</th>
        <th>创建时间</th>
        <th>支付时间</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody>
    <tr th:each="order:${orderList}">
        <td th:text="${order.id}"></td>
        <td th:text="${order.statusText}"></td>
        <td th:text="${order.createTime}"></td>
        <td th:text="${order.payTime}"></td>
        <td th:if="${order.status} == '0'"><a th:onclick="'javascript:orderPy('+${order.id}+')'" href="javascript:void(0)">去支付</a></td>
        <td th:if="${order.status} == '1'"><a th:href="@{'/order/' + ${order.id}}" target="_blank">订单已支付</a></td>
        <td th:if="${order.status} == '2'"><a th:href="@{'/order/' + ${order.id}}" target="_blank">订单已超时</a></td>
    </tr>
    </tbody>
</table>
</body>
<script>
    function orderPy(id) {
        $.ajax({
            url: ctxPath + 'order/pay/' + id,
            dataType: "json",
            success: function (res) {
                alert(res.msg)
                if (res.status) {
                    window.location.reload();
                }
            },
            error: function (res) {
                alert(res)
            }
        });
    }
</script>
</html>